<template>
	<view class="container">
		<uni-list v-if="showStatus">
			<uni-list-item showExtraIcon="true" :extraIcon="{type: 'shop-filled'}" title="饲料类型" :rightText="type" />
			<uni-list-item showExtraIcon="true" :extraIcon="{type: 'location-filled'}" title="存储地点"
				:rightText="position" />
			<uni-list-item showExtraIcon="true" :extraIcon="{type: 'person-filled'}" title="供应商"
				:rightText="purchase.materiaFeedPurchaseProvider" />
			<uni-list-item showExtraIcon="true" :extraIcon="{type: 'settings-filled'}" title="数量"
				:rightText="purchase.materiaFeedPurchaseNum+' 袋'" />
			<uni-list-item showExtraIcon="true" :extraIcon="{type: 'tune-filled'}" title="每袋重量"
				:rightText="purchase.materiaFeedPurchaseWeight+' KG'" />
			<uni-list-item showExtraIcon="true" :extraIcon="{type: 'minus-filled'}" title="单价"
				:rightText="purchase.materiaFeedPurchasePrice+' ￥'" />
			<uni-list-item showExtraIcon="true" :extraIcon="{type: 'more-filled'}" title="总价"
				:rightText="purchase.materiaFeedPurchaseTotlePrice+' ￥'" />
			<uni-list-item showExtraIcon="true" :extraIcon="{type: 'calendar-filled'}" title="进货时间"
				:rightText="purchase.materiaFeedPurchaseDate" />
			<uni-list-item showExtraIcon="true" :extraIcon="{type: 'calendar-filled'}" title="过期时间"
				:rightText="purchase.materiaFeedExpireTime" />
			<uni-list-item showExtraIcon="true" :extraIcon="{type: 'chat-filled'}" title="备注">
				<template v-slot:footer>
					<input type="textarea" v-model="purchase.remark"
						style="font-size: 12px;color: #999999;text-align: right;" />
				</template>
			</uni-list-item>
		</uni-list>
		<view class="button-group" v-if="showStatus">
			<button type="warn" plain="true" @click="purchaseDelete" style="width: 45%;border: #E53F32 solid 1px;">删 除</button>
			<button type="primary" plain="ture" @click="purchaseEdit" style="width: 45%;">修 改</button>
		</view>
		
		<!-- 修改 -->
		<view class="example" v-if="!showStatus">
		  <uni-forms ref="form" :model="purchaseForm" :rules="rules" labelWidth="80px">
		    <uni-forms-item label="饲料类型" name="materiaFeedType" required>
		      <uni-data-select v-model="purchaseForm.materiaFeedType" :placeholder="type"
		      	:localdata="material_type"
		        ></uni-data-select>
		    </uni-forms-item>
			<uni-forms-item label="存储地点" name="materiaFeedStorePosition" required>
			  <uni-data-select v-model="purchaseForm.materiaFeedStorePosition" :placeholder="position"
			  	:localdata="store_position"
			    ></uni-data-select>
			</uni-forms-item>
		    <uni-forms-item label="供应商" name="materiaFeedPurchaseProvider" required>
		      <uni-easyinput v-model="purchaseForm.materiaFeedPurchaseProvider" placeholder="请输入供应商" />
		    </uni-forms-item>
			<uni-forms-item label="数量" name="materiaFeedPurchaseNum" required>
			  <uni-easyinput type="number" v-model="purchaseForm.materiaFeedPurchaseNum" placeholder="请输入数量(袋)" />
			</uni-forms-item>
			<uni-forms-item label="每袋重量" name="materiaFeedPurchaseWeight" required>
			  <uni-easyinput type="number" v-model="purchaseForm.materiaFeedPurchaseWeight" placeholder="请输入每袋重量(kg)" />
			</uni-forms-item>
			<uni-forms-item label="单价" name="materiaFeedPurchasePrice" required>
			  <uni-easyinput type="number" v-model="purchaseForm.materiaFeedPurchasePrice" placeholder="请输入单价" />
			</uni-forms-item>
			<uni-forms-item label="总价" name="materiaFeedPurchaseTotlePrice" required>
			  <uni-easyinput type="number" v-model="purchaseForm.materiaFeedPurchaseTotlePrice" placeholder="请输入总价" />
			</uni-forms-item>
			<uni-forms-item label="进货时间" name="materiaFeedPurchaseDate" required>
			  <uni-datetime-picker type="datetime" v-model="purchaseForm.materiaFeedPurchaseDate"/>
			</uni-forms-item>
			<uni-forms-item label="过期时间" name="materiaFeedExpireTime" required>
			  <uni-datetime-picker type="datetime" v-model="purchaseForm.materiaFeedExpireTime"/>
			</uni-forms-item>
			<uni-forms-item label="备注">
				<uni-easyinput type="textarea" v-model="purchaseForm.remark" placeholder="请输入备注" />
			</uni-forms-item>
		  </uni-forms>
		  <view class="edit-button-group">
		  	<button type="primary" @click="back" plain="true" style="width: 45%;">返 回</button>
		  	<button type="primary" @click="editPurchase('form')" plain="true" style="width: 45%;">提 交</button>
		  </view>
		</view>
	</view>
</template>

<script>
	import {
		getPurchase,delPurchase,updatePurchase, getTypes
	} from "@/api/hmy/material";

	export default {
		data() {
			return {
				showStatus:true,
				purchaseId: '',
				purchase: {},
				purchaseForm:{},
				//饲料类型
				type: '',
				typesList:[],
				position: '',
				positionList:[],
				material_type:[],
				store_position:[],
				rules: {
					materiaFeedType: {
						rules: [{required: true, errorMessage: '饲料种类不能为空'}]
					},
					materiaFeedPurchaseDate: {
						rules: [{required: true, errorMessage: '进货时间不可为空'}]
					},
					materiaFeedPurchaseProvider: {
				  		rules: [{required: true, errorMessage: '供应商不能为空'}]
					},
					materiaFeedPurchaseNum: {
						rules: [{required: true, errorMessage: '数量不能为空'}]
					},
					materiaFeedPurchaseWeight: {
						rules: [{required: true, errorMessage: '每袋重量不能为空'}]
					},
					materiaFeedPurchasePrice: {
						rules: [{required: true, errorMessage: '单价不能为空'}]
					},
					materiaFeedPurchaseTotlePrice: {
						rules: [{required: true, errorMessage: '总价不能为空'}]
					},
					materiaFeedStorePosition: {
						rules: [{required: true, errorMessage: '存储地点不能为空'}]
					},
					materiaFeedExpireTime: {
						rules: [{required: true, errorMessage: '过期时间不能为空'}]
					}
				},
			}
		},
		onLoad(option) { //option为object类型，会序列化上个页面传递的参数
			//console.log(option.id);
			this.purchaseId = option.id;
			this.getTypesList();
			this.getPositionsList();
			this.getPurchaseInfo();
		},
		created() {
			
		},
		methods: {
			//获取存储地点
			getPositionsList(){
				this.positionList = this.$dict.getType('materia_feed_store_position');
				this.positionList.forEach(item => {
					this.store_position.push({'text': item.label, 'value' : item.value})
				})
			},
			//动态获取饲料数据
			getTypesList(){
			  getTypes().then(res => {
				this.typesList = res.data;
				this.typesList.forEach(item => {
					this.material_type.push({'text': item.materiaFeedType, 'value' : item.materiaFeedTypeId})
				})
			  })
			},
			//获取进货记录
			getPurchaseInfo() {
				//显示加载框
				uni.showLoading({
					title:"加载中"
				})
				getPurchase(this.purchaseId).then(response => {
					this.purchaseForm = response.data;
					this.purchase = response.data;
					this.typesList.forEach(item => {
						if(this.purchase.materiaFeedType == item.materiaFeedTypeId){
							this.type = item.materiaFeedType
						}
					})
					this.positionList.forEach(item => {
						if(this.purchase.materiaFeedStorePosition == item.value){
							this.position = item.label;
						}
					})
					
					//隐藏加载框
					uni.hideLoading();
				})
			},

			//删除
			purchaseDelete() {
				console.log("delete", this.purchase.materiaFeedPurchaseId)
				this.$modal.confirm('是否确认删除进货编号为"' + this.purchase.materiaFeedPurchaseId + '"的数据项？').then(() => {
					return delPurchase(this.purchase.materiaFeedPurchaseId);
				}).then(response => {
					this.$modal.msgSuccess("删除成功");
					setTimeout(()=>{
						this.$tab.navigateTo('/pages/hmy/material/purchase');
					},1000)
				}).catch(()=>{
				});
			},

			//修改
			purchaseEdit() {
				console.log("edit", this.purchase.materiaFeedPurchaseId)
				//显示加载框
				uni.showLoading({
					title:"加载中"
				})
				this.showStatus = !this.showStatus;
				//隐藏加载框
				uni.hideLoading();
			},
			
			//返回
			back(){
				this.showStatus = !this.showStatus
				this.getPurchaseInfo();
			},
			
			//修改提交
			editPurchase(form) {
			  this.$refs[form].validate().then(res => {
			    updatePurchase(this.purchaseForm).then(response => {
			      this.$modal.msgSuccess("修改成功");
				  setTimeout(()=>{
				  	this.$tab.navigateTo('/pages/hmy/material/purchase');
				  },1000)
				  
			    })
			  })
			}
		}
	}
</script>

<style>
	page {
		background-color: #ffffff;
	}

	.button-group {
		display: flex;
		justify-content: space-around;
		width:100%;
		position:fixed;
		bottom:5px;

	}
	
	.example {
	  padding: 15px;
	  background-color: #fff;
	}
	.edit-button-group{
		display: flex;
		justify-content: space-around;
	}
</style>